<script lang="ts" setup>
	import { ref ,reactive,getCurrentInstance, onMounted} from 'vue'
	import {
		useRouter
	} from 'uni-mini-router'
	import workerTabbar from "@/components/worker-tabbar/worker-tabbar.vue"
	import {
		userStore
	} from '@/pinia';
	import {
		onShow,
		onHide,
		onLoad,
		onBackPress
	} from '@dcloudio/uni-app'
	const router = useRouter()
	const {proxy} = getCurrentInstance()
	
	const userStoreInfo = userStore();
	onBackPress(() => {
		router.pushTab({
			name: 'index',
			params: {}
		})
	})
	const bgColor = 'transparent'
	
	const state = reactive({
		userInfo:{}
	})
	const routerLink = (e)=>{
		router.push({
			name: e,
			params: {}
		})
	}
	
	const getMeiyeRecruitHrInfo3QueryById = ()=>{
		proxy.$req('GET', proxy.$api.meiyeRecruitHrInfo3QueryById, {id:userStoreInfo.userInfo.id}).then((res) => {
			console.log(res);
			if(res.code === 200){
				state.userInfo = res.result
			}
		})
	}
	
	// onMounted(()=>{
	// 	getMeiyeRecruitHrInfo3QueryById()
	// })
	onShow(()=>{
		getMeiyeRecruitHrInfo3QueryById()
	})
	
	const toList =(e)=>{
		if(e==0){
			router.push({
				name:'communicate'
				})
		}
		if(e==1){
			router.push({
				name:'receivedResume'
				})
		}
		if(e==2){
			router.push({
				name:'interview'
				})
		}

	}
	
	const toVip = ()=>{
		router.push({
			name: 'vipbackpostUp',
		})
	}
	
	const toLink = ()=>{
		router.push({
			name: 'vipbackup',
			params: {
				pageType:'bossMine',
				vipTime:state.userInfo.vipTime,
				isVip:state.userInfo.isVip,
				payAmount:state.userInfo.payAmount,
				communicateNumber:state.userInfo.communicateNumber,
				receivedNumber:state.userInfo.receivedNumber,
				sendNumber:state.userInfo.sendNumber,
			}
		})
	}
	
</script>
<template>
	<u-navbar :placeholder="true" :bgColor="bgColor">
		<template #left>
			<view></view>
		</template>
		<template #center>
			我的
		</template>
	</u-navbar>
	<view class="headerBox ">
		<view class="headerBoxMain r-flex-between-center"  @click="routerLink('setBossInfo')">
			<view class="hbl r-flex-between-center">
				<image :src="state.userInfo.headImage" mode=""></image>
				<view class="c-flex-start-center">
					<text>{{state.userInfo.username}}</text>
					<!-- <text>{{state.userInfo.subtitle}}</text> -->
					<text>{{state.userInfo.post}}</text>
				</view>
			</view>
		<!-- 	<view class="hbr">
				<u-icon name="arrow-right"></u-icon>
			</view> -->
		</view>
		
	</view>
	<view class="payJob">
		<view class="payJob-top r-flex-between-center">
			<view class="pjL c-flex-start-start">
				<text>置顶职位 提升职位曝光</text>
				<text>招聘快一步 效果翻倍</text>
			</view>
			<view class="pjR c-flex-start-end">
				<view class="pjrI" @click="toVip">
					去购买
				</view>
			</view>
		</view>
		<!-- v-if="state.userInfo.jobCount>0" -->
		<view class="zd" v-if="state.userInfo.jobCount>0" @click="toLink">
			<text>职位置顶中</text>
			<view class="zd-right">
				<text>{{state.userInfo.jobCount}}</text>
				<u-icon name="arrow-right"></u-icon>
			</view>
			
		</view>
	</view>
	
	<view class="threeBox r-flex-around-center">
		<view class="tbBox c-flex-around-center" @click="toList(0)">
			<text>{{state.userInfo.communicateNumber || 0}}</text>
			<text>沟通过</text>
		</view>
		<view class="tbBox c-flex-around-center" @click="toList(1)">
			<text>{{state.userInfo.receivedNumber || 0}}</text>
			<text>已收简历</text>
		</view>
		<view class="tbBox c-flex-around-center" @click="toList(2)">
			<text>{{state.userInfo.sendNumber || 0}}</text>
			<text>发出面试</text>
		</view>
	</view>
	<view class="">
		<worker-tabbar name="bossMine"></worker-tabbar>
	</view>
</template>
<style lang="scss">
	page {
			
			position: relative;
			background: url('../../../static/images/communityBg.png') no-repeat;
			background-color: #FAFAFAFF;
	}
	.headerBox {
		padding:30rpx 20rpx 0;
		width:100%;
		height: 200rpx;
		.headerBoxMain{
			width:94%;
			height:100%;
			padding:0 28rpx;
			border-radius: 16rpx;
			// background: #F8F7F9;
			box-sizing: border-box;
		}

		.hbl {
			
			image {
				width: 120rpx;
				height: 120rpx;
				border-radius: 60rpx;
				margin-right: 20rpx;
			}
			
			.c-flex-start-center{
				text:nth-child(1){
					font-size:36rpx;
					color:#636366;
				}
			}
			
		}

		.hbr {}
	}

	.payJob {
		width: calc(94%);
		padding: 20rpx 30rpx;
		height: 228rpx;
		margin: 30rpx auto;
		background: #F8F7F9;
		border-radius: 16rpx;
		box-sizing: border-box;
		background: url('../../../static/images/zd.png') no-repeat;
		background-size: cover;
		.payJob-top{
			height: 120rpx;
		}
		.pjL {
			height: 100%;
			text:nth-child(1) {
				font-size: 32rpx;
				font-weight:600;
				color:#FFE9C9FF;
				margin-bottom:16rpx;
			}

			text:nth-child(2) {
				font-size: 28rpx;
				color:#FFE9C9FF;
			}
		}

		.pjR {
			// height: 110rpx;

			.pjrI {
				padding: 4rpx 20rpx;
				background-color: #e7e7e7;
				border-radius: 20rpx;
				font-size: 26rpx;
			}
		}
	}

	.zd{
		display:flex;
		justify-content: space-between;
		padding:30rpx 0rpx 10rpx;
		color:#000000A6;
		
		
		.zd-right{
			display:flex;
			align-items: center;
		}
	}
	
	.threeBox {
		width: calc(94%);
		height: 170rpx;
		margin: 0 auto;
		background: #fff;
		border-radius: 16rpx;

		.tbBox {
			text:nth-child(1){
				font-weight: 600;
			}
			text:nth-child(2){
				color:#000000A6;
			}
		}
	}
</style>